<template>
  <div class="full-box shadow-box padding-box">
    <OperateCommon :showBack="true" @back="goBack"></OperateCommon>
    <el-collapse v-model="activeNames" :accordion="false">
      <el-collapse-item title="预警整改详情" name="1" v-if="detail">
        <div class="desc">
          <label>项目名称：</label>
          <span>{{ detail.object_name }}</span>
        </div>
        <div class="desc">
          <label>建设单位：</label>
          <span>{{ detail.responsible_name }}</span>
        </div>
        <div class="desc">
          <label>预警单位：</label>
          <span>
            {{ detail.warningDetail.dept_name }}
          </span>
        </div>
        <div class="desc">
          <label>预警发生时间：</label>
          <span>
            {{ detail.warningDetail.trigger_time }}
          </span>
        </div>
        <div class="desc">
          <label>预警节点：</label>
          <span>
            {{ detail.warningDetail.warning_content }}
          </span>
        </div>
        <div class="desc">
          <label>承办单位：</label>
          <span>
            {{ detail.undertake_dept_name }}
          </span>
        </div>
        <div class="desc">
          <label>交办意见：</label>
          <span>
            {{ detail.assign_opinion }}
          </span>
        </div>
        <div class="desc">
          <label>整改期限：</label>
          <span> {{ detail.mend_days }} 天 </span>
        </div>
        <div class="desc">
          <label>整改单类型：</label>
          <span>
            {{ detail.type_text }}
          </span>
        </div>
        <div class="desc">
          <label>附件材料：</label>
          <CommonUpload
            tableName="rectification"
            useType="send"
            :pid="detail.id"
            :showUploadBtn="false"
            :disabled="true"
          ></CommonUpload>
        </div>
        <div class="desc">
          <label>交办单位：</label>
          <span>
            {{ detail.assign_dept_name }}
          </span>
        </div>
        <div class="desc">
          <label>交办时间：</label>
          <span>
            {{ detail.assign_time }}
          </span>
        </div>
      </el-collapse-item>
      <el-collapse-item v-if="detail" title="预警整改反馈详情" name="2">
        <div v-if="detail.feedbackDetail != null">
          <div
            class="history"
            v-for="(item, index) in detail.feedbackDetail"
            :key="index"
          >
            <div class="desc">
              <label>责任人：</label>
              <span>
                {{ item.feedback_user_name }}
              </span>
            </div>
            <div class="desc">
              <label>反馈时间：</label>
              <span>
                {{ item.feedback_date }}
              </span>
            </div>
            <div class="desc">
              <label>整改完成时间：</label>
              <span>
                {{ item.finish_date }}
              </span>
            </div>
            <div class="desc">
              <label>整改情况：</label>
              <span>
                {{ item.feedback_content }}
              </span>
            </div>
            <div class="desc">
              <label>附件：</label>
              <CommonUpload
                tableName="alert-rectification-feedback"
                useType="report"
                :pid="item.id"
                :showUploadBtn="false"
                :disabled="true"
              ></CommonUpload>
            </div>
            <div class="desc">
              <label>建章立制：</label>
              <span>
                {{ item.create_system }}
                <span>项</span>
              </span>
            </div>
            <div class="desc">
              <label>警示教育：</label>
              <span>
                {{ item.inculcate }}
                <span>场</span>
              </span>
            </div>
            <div class="review-wrapper">
              <!-- 审核情况 审核者 -->
              <div v-if="item.check_status == 0 && pageType == 1">
                <el-form
                  :model="reviewForm"
                  ref="reviewForm"
                  :rules="reviewRules"
                  label-width="150px"
                >
                  <el-form-item label="审核意见" prop="">
                    <el-input
                      type="textarea"
                      v-model="reviewForm.opinion"
                      :autosize="{
                        minRows: 3,
                        maxRows: 6,
                      }"
                    ></el-input>
                  </el-form-item>
                  <el-form-item label="">
                    <el-button type="success" @click="review(item, 1)"
                      >通过</el-button
                    >
                    <el-button type="danger" @click="review(item, 2)"
                      >退回</el-button
                    >
                  </el-form-item>
                </el-form>
              </div>
              <!-- 已审核 -->
              <div v-if="item.check_status != 0">
                <div class="desc">
                  <label>审核人：</label>
                  <span>
                    {{ item.check_user_name }}
                  </span>
                </div>
                <div class="desc">
                  <label>审核结果：</label>
                  <span>
                    <el-tag
                      size="mini"
                      effect="dark"
                      :type="item.check_status == 1 ? 'success' : 'danger'"
                      :closable="false"
                    >
                      {{ item.check_status_text }}</el-tag
                    >
                  </span>
                </div>
                <div class="desc">
                  <label>审核意见：</label>
                  <span>
                    {{ item.opinion }}
                  </span>
                </div>
                <div class="desc">
                  <label>审核时间：</label>
                  <span>
                    {{ item.check_time }}
                  </span>
                </div>
              </div>
              <!-- 审核情况 反馈者 -->
              <div
                class="unreview"
                v-if="item.check_status == 0 && pageType == 0"
              >
                <b> 未审核 </b>
              </div>
            </div>
          </div>
        </div>
        <div v-if="(detail.status == 0 || detail.status == 3) && pageType == 1">
          <el-empty :image-size="80" description="未反馈"></el-empty>
        </div>
        <div
          class="feedback-wrapper"
          v-if="(detail.status == 0 || detail.status == 3) && pageType == 0"
        >
          <el-form
            :model="feedbackForm"
            ref="feedbackForm"
            :rules="feedbackRules"
            label-width="150px"
          >
            <el-form-item label="责任人" prop="feedback_user_name">
              <el-input v-model="feedbackForm.feedback_user_name"></el-input>
            </el-form-item>
            <el-form-item label="反馈时间" prop="feedback_date">
              <el-date-picker
                v-model="feedbackForm.feedback_date"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期时间"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="整改完成时间" prop="finish_date">
              <el-date-picker
                v-model="feedbackForm.finish_date"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期时间"
              >
              </el-date-picker>
            </el-form-item>
            <el-form-item label="整改情况" prop="feedback_content">
              <el-input
                type="textarea"
                v-model="feedbackForm.feedback_content"
                :autosize="{
                  minRows: 3,
                  maxRow: 6,
                }"
              ></el-input>
            </el-form-item>
            <el-form-item label="附件" prop="">
              <CommonUpload
                tableName="alert-rectification-feedback"
                useType="report"
              ></CommonUpload>
            </el-form-item>
            <el-form-item label="建章立制" prop="create_system">
              <el-input-number
                v-model="feedbackForm.create_system"
                :min="0"
                :step="1"
                :precision="0"
                :controls="true"
                controls-position="right"
              >
              </el-input-number>
              <span style="margin-left: 10px"> 项 </span>
            </el-form-item>
            <el-form-item label="警示教育" prop="inculcate">
              <el-input-number
                v-model="feedbackForm.inculcate"
                :min="0"
                :step="1"
                :precision="0"
                :controls="true"
                controls-position="right"
              >
              </el-input-number>
              <span style="margin-left: 10px"> 场 </span>
            </el-form-item>
            <el-form-item label="">
              <el-button type="primary" @click="feedbak">反馈</el-button>
            </el-form-item>
          </el-form>
        </div>
      </el-collapse-item>
      <!-- <el-collapse-item
        v-if="detail && detail.status != '0'"
        title="预警整改审核详情"
        name="3"
      >
        <div v-if="detail.status == 1 && pageType == 0">
          <el-empty :image-size="80" description="未审核"></el-empty>
        </div>
        <div v-if="detail.status == 1 && pageType == 1">
          <el-form
            :model="reviewForm"
            ref="reviewForm"
            :rules="reviewRules"
            label-width="150px"
          >
            <el-form-item label="审核意见" prop="">
              <el-select v-model="reviewForm.check_status">
                <el-option :key="1" label="满意" :value="1"></el-option>
                <el-option :key="2" label="不满意" :value="2"></el-option>
              </el-select>
            </el-form-item>
            <el-form-item label="">
              <el-button type="primary" @click="review">审核</el-button>
            </el-form-item>
          </el-form>
        </div>
        <div v-if="detail.status == 2">
          <div class="desc">
            <label>审核人：</label>
            {{ detail.feedbackDetail.check_user_name }}
          </div>
          <div class="desc">
            <label>审核意见：</label>
            {{ detail.feedbackDetail.check_status_text }}
          </div>
          <div class="desc">
            <label>审核时间：</label>
            {{ detail.feedbackDetail.check_time }}
          </div>
        </div>
      </el-collapse-item> -->
    </el-collapse>
  </div>
</template>

<script>
import {
  getAlertRectificationDetail,
  postAlertRectificationFeedback,
  postAlertRectificationReview,
} from "@/api/AlertRectification/Index";
import CommonUpload from "@/components/Common/CommonUpload.vue";
import uploadMixin from "@/components/GenerateForm/uploadMixin";
import { required } from "@/utils/eValidate";
import { getCurrentDateTime } from "@/utils/date";
import OperateCommon from "@/components/Common/OperateCommon.vue";
import LinkTo from "@/mixins/LinkTo";
export default {
  name: "AlertRectification",
  mixins: [uploadMixin, LinkTo],
  components: { CommonUpload, OperateCommon },
  data() {
    return {
      id: 0,
      pageType: 0, // 0 反馈 1 审核
      detail: null,
      activeNames: ["1", "2"],
      feedbackForm: {
        feedback_user_name: "", // 责任人
        feedback_date: getCurrentDateTime(), // 反馈时间
        finish_date: "", // 整改完成时间
        feedback_content: "", // 整改情况
        create_system: "", // 建章立制 项
        inculcate: "", // 警示教育 场
      },
      feedbackRules: {
        feedback_user_name: [required],
        feedback_date: [required],
        finish_date: [required],
        feedback_content: [required],
        create_system: [],
        inculcate: [],
      },
      reviewForm: {
        opinion: "", // 审核意见
      },
      reviewRules: {},
    };
  },
  methods: {
    goBack() {
      switch (parseInt(this.pageType)) {
        case 0:
          this.linkTo("/alertRectification/feedback");
          break;
        case 1:
          this.linkTo("/alertRectification/review");
          break;
        default:
          break;
      }
    },
    initData() {
      getAlertRectificationDetail({ id: this.id }).then((res) => {
        if (res.code == 0) {
          this.detail = res.data;
          this.checkStep(this.detail.status);
        }
      });
    },
    feedbak() {
      this.$refs.feedbackForm.validate((valid) => {
        if (valid) {
          this.feedbackForm.warning_mend_id = this.detail.id;
          postAlertRectificationFeedback(this.feedbackForm).then((res) => {
            if (res.code == 0) {
              this.$message.success("反馈成功");
              this.checkFile(res.data);
              this.initData();
            }
          });
        }
      });
    },
    review(item, type) {
      this.reviewForm.check_time = getCurrentDateTime();
      this.reviewForm.id = item.id;
      this.reviewForm.check_status = type;

      postAlertRectificationReview(this.reviewForm).then((res) => {
        if (res.code == 0) {
          this.$message.success("审核成功");
          this.initData();
        }
      });
    },
    checkStep(status) {
      switch (parseInt(status)) {
        case 0:
          this.activeNames = ["1", "2"];
          break;
        case 1:
          this.activeNames = ["1", "2", "3"];
          break;
        case 2:
          this.activeNames = ["1", "2", "3"];
          break;
        default:
          this.activeNames = ["1", "2"];
          break;
      }
    },
  },
  created() {
    this.id = this.$route.params.id;
    this.pageType = this.$route.params.type;
    this.initData();
  },
};
</script>

<style lang="scss" scoped>
.history {
  box-sizing: border-box;
  padding: 10px 0;
  border-bottom: 1px solid #000;
}
.review-wrapper {
  margin-top: 10px;
  box-sizing: border-box;
  padding: 10px 0;
  border-top: 2px dashed #ccc;
  > label {
    font-weight: 600;
    font-size: 16px;
  }
}
.unreview {
  text-align: center;
}
.feedback-wrapper {
  margin-top: 20px;
}
</style>
